<script setup lang="ts">
import { computed } from 'vue';
import { storeToRefs } from 'pinia';
import useSettingStore from '@/stores/modules/setting';

const settingStore = useSettingStore();
const { asideActive, asideExpand } = storeToRefs(settingStore);

const mainClassObj = computed(() => ({
  hidden: asideActive.value && asideExpand.value,
}));
</script>

<script lang="ts">
export default {
  name: 'YMain',
};
</script>

<template>
  <main class="flex-1 bg-blue-400" :class="mainClassObj">
    <h1>Main</h1>
  </main>
</template>

<style scoped></style>
